<template>
  <div>
    <h3>用户--- {{ $route.params.id || 0 }}</h3>
  </div>
</template>

<script>
export default {
  beforeRouteEnter(to, from, next) {
    console.log('beforeRouteEnter')
    next()
  },
  // 此守卫专门给 动态路由参数切换所用 /xxx/:id
  // 动态路由后，vue给我们把当前组件缓存了
  beforeRouteUpdate(to, from, next) {
    console.log('beforeRouteUpdate')
    next()
  },
  beforeRouteLeave(to, from, next) {
    console.log('beforeRouteLeave@')
    next()
  },

  beforeCreate() {
    console.log('组件 -- beforeCreate')
  },
  // 侦听器
  watch: {
    $route: {
      handler(newValue, oldValue) {
        console.log('aaa')
      },
      // 默认就执行
      immediate:true
    },
  },
}
</script>

<style lang="scss" scoped>
</style>